html{
	box-sizing: border-box;
	overflow: hidden;
	overflow-y: scroll; /* has to be scroll, not auto */
	-webkit-overflow-scrolling: touch;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

*, *:before, *:after {
box-sizing: inherit;
}

input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px rgba(34,34,34,1) inset;
			-webkit-text-fill-color: #fff !important;
				border:none!important;
				border-left:solid 5px #00cf7f!important;
}

@keyframes "spin" {
	from {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(359deg);
		-moz-transform: rotate(359deg);
		-o-transform: rotate(359deg);
		-ms-transform: rotate(359deg);
		transform: rotate(359deg);}
}
@-moz-keyframes spin {
	from {-moz-transform: rotate(0deg);transform: rotate(0deg);}
	to {-moz-transform: rotate(359deg);transform: rotate(359deg);}
}
@-webkit-keyframes "spin" {
	from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
	to {-webkit-transform: rotate(359deg);transform: rotate(359deg);}
}
@-ms-keyframes "spin" {
	from {-ms-transform: rotate(0deg);transform: rotate(0deg);}
	to {-ms-transform: rotate(359deg);transform: rotate(359deg);}
}
@-o-keyframes "spin" {
	from {-o-transform: rotate(0deg);transform: rotate(0deg);}
	to {-o-transform: rotate(359deg);transform: rotate(359deg);}
}

.cm-loading {
	position:absolute;
	top:50%;
	left:50%;
	margin-top:-12px;
	margin-left:-12px;
	background-color:transparent;
	border-bottom: 3px solid #ccc;
	border-left: 3px solid #ccc;
	border-right: 3px solid #666;
	border-top: 3px solid #666;
	border-radius: 100%;
	height: 24px;
	width: 24px;
	-webkit-animation: spin .9s infinite linear;
	-moz-animation: spin .9s infinite linear;
	-ms-animation: spin .9s infinite linear;
	-o-animation: spin .9s infinite linear;
	animation: spin .9s infinite linear;
}

/* Incomplete required animation */

@keyframes nope {
	 0%, 100% { transform: translateX(0px) rotateY(0deg); }
   25%, 75% { transform: translateX(-5px) rotateY(-5deg); }
   50% { transform: translateX(5px) rotateY(5deg); }
}

.nope {
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	animation-duration: 600ms;
	animation-timing-function: ease-in-out;
	animation-name: nope;
}

/* Objects in Overlay */
.cm-overlay{
	perspective: 500px;
	-webkit-perspective: 500px;
	font-family: 'Montserrat', sans-serif;
}

/* Container Position */
.cm-userinput-container {
	margin:0 auto;
	padding:0 20px;
}

/* Forms */
.cm-overlay form{
	width:100%;
}

#cm-userinput-message{
	margin:0 0 36px 0;
	font-size: 14px;
}

.cm-overlay input{
	display:inline-block;
	width:100%;
	border:none;
	margin:0 0 1% 0;
	padding:15px 0;
	background:#f5f5f5;
	border: solid 1px rgba(34,34,34,0.5);
	background:rgba(34,34,34,0.7);
	color:#fff;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	text-indent: 15px;
	font-size: 11px;
	font-family: 'Montserrat', sans-serif;
}

.cm-overlay select{
	display: inline-block;
	padding:0;
	margin:0 0 3px 0;
	line-height: 36px;
	background:rgba(34,34,34,0.9);
	border: solid 1px rgba(34,34,34,0.5);
	color:#fff;
	width:50%;
	height:46px;
	text-indent: 15px;
	font-family: 'Montserrat', sans-serif;
	-moz-appearance: none;
  -webkit-appearance: none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font-size: 11px;
	background-image:url("");
	background-size: 6px;
	background-repeat: no-repeat;
	background-position: 95% 50%;
}


/* Specific field resizes */

.cm-overlay select, #cm-userinput-getstripetoken-name, #cm-userinput-getstripetoken-email{
	width:49.5%;
}

#cm-userinput-getshippingaddress-city, #cm-userinput-getshippingaddress-state, #cm-userinput-getshippingaddress-postalcode, #cm-userinput-getstripetoken-card-expiry-month, #cm-userinput-getstripetoken-card-expiry-year, #cm-userinput-getstripetoken-card-cvc{
	width:32.65%;
}


.cm-overlay select:first-of-type{
	margin-right:0.5%;
}

.cm-overlay select:nth-of-type(2){
	margin-left:0.5%;
}

#cm-userinput-getshippingaddress-city, #cm-userinput-getstripetoken-name{
	margin-right:0.5%;
}

#cm-userinput-getshippingaddress-state, #cm-userinput-getstripetoken-email{
	margin-left:0.5%;
}

#cm-userinput-getshippingaddress-postalcode, #cm-userinput-getstripetoken-card-cvc{
	margin-left: 1%;
}


.cm-overlay select:first-of-type{
		/*margin-right:3px;*/
}

.cm-overlay input:focus{
	background:#111;
	-webkit-transition: background 0.3s ease-in-out;
	transition: background 0.3s ease-in-out;
}

/* Buttons */
.cm-overlay input[type=submit], .cm-overlay .button, .cm-overlay button {
	margin:36px 0 0 0;
	padding:15px 0;
  background: none;
  border: solid 2px #00cf7f;
  color:#00cf7f;
	display: block;
	width: 100%;
	font-size: 12px;
	font-family: 'Montserrat', sans-serif;
}

.cm-overlay input[type=submit]:hover, .cm-overlay .button:hover, .cm-overlay button:hover{
	background:#00cf7f;
	color:#333;
	cursor: pointer;
	-webkit-transition: background 0.3s ease-in-out;
	transition: background 0.3s ease-in-out;
}

/* Remove Outline */
.cm-overlay select, .cm-overlay button:focus, .cm-overlay textarea:focus,.cm-overlay input:focus{
    outline: none;
}

/* Checkout Choice */

.cm-checkout-choose span{
		font-size: 12px;
	  padding:60px 30px 15px 30px;
		margin:0 1px 0 0;
		color:#7d7d7d;
		width: 200px;
    display: inline-block;
		background-color: rgba(17,17,17,0.8);
}

.cm-checkout-choose .pay-pp{
	background-image:url("");
	background-size: 65%;
	background-repeat: no-repeat;
	background-position: 50% 15px;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-bottomleft: 3px;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}

.cm-checkout-choose .pay-cc{
	background-image:url("");
	background-size: 65%;
	background-repeat: no-repeat;
	background-position: 50% 5px;
	-webkit-border-top-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	-moz-border-radius-topright: 3px;
	-moz-border-radius-bottomright: 3px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;

}
.cm-checkout-choose .pay-pp:hover, .cm-checkout-choose .pay-cc:hover{
	opacity: 0.6;
	border-color:#fff;
	cursor: pointer;
	-webkit-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
}

/* Helpers */

/* Incomplete required field */
.incomplete{
	border:solid 1px red!important;
	-webkit-transition: border 0.3s ease-in-out;
	transition: border 0.3s ease-in-out;
}

.cm-userinput-message{
		font-size: 12px;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

/* Intermediate & Up + */
@media screen and (min-width: 48em) {

	.cm-userinput-container {
		width:50%;
		max-width: 540px;
	}

}

/* Tablet Landscape */
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {

}

/* Tablet Portrait */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1){

}

/* Mobile Landscape view */
@media screen and (min-device-width: 320px) and (max-device-height: 736px) and (orientation: landscape){

}
